* {
    margin: 0;
    padding: 0;
    font-family: 'Source Sans Pro', sans-serif;
}

body {
    margin: 0;
    padding: 0;
}

/* 暗色主题变量 dark 暗色主题 */
html[data-theme="dark"] {
    --text-color: #fff;
    --bg-color: linear-gradient(to bottom, #070707, #262727);
}


/* 默认主题变量 light 亮色主题 */
/*定义全局变量*/
:root {
    --menu-height: 46px;
    /* 菜单背景颜色 */
    --el-menu-bg-color: #070707;
    /* 菜单文字颜色 */
    --el-menu-text-color: #fff;
    /* 选中菜单项的文字颜色 */
    --el-menu-active-color: #409EFF;
    /* 鼠标悬浮菜单之上的背景颜色 */
    --el-menu-hover-bg-color: #28282a;
    /* 侧边栏背景颜色 */
    --v-sidebar-bg-color: #070707;
    /* 侧边栏文字颜色 */
    --v-sidebar-text-color: #fff;
    /*顶部信息栏背景颜色*/
    --v-header-bg-color: #fff;

    /* 滚动条宽度 */
    --scrollbar-width: 4px;
    /* 滚动条轨道的背景颜色 */
    --scrollbar-track-color: #fff;
    /* 滚动条滑块的背景颜色 */
    --scrollbar-thumb-color: #BFBFBF;
    /* 鼠标悬浮到滑动上时的滑块颜色 */
    --scrollbar-thumb-hover-color: #777;
    /* 滚动条边框圆角宽度 */
    --scrollbar-thumb-border-radius: 4px;


    --text-color: #000;
    --bg-color: linear-gradient(to bottom, #E6A5D5, #87CDE0);
}


/* 滚动条Chrome、Safari等WebKit内核浏览器 */
/* 设置滚动条的轨道宽度 */
::-webkit-scrollbar {
    /*滚动条轨道宽度*/
    width: var(--scrollbar-width);
}

/* 设置滚动条的轨道背景颜色 */
::-webkit-scrollbar-track {
    /*轨道的背景颜色*/
    background-color: var(--scrollbar-track-color);
}

/* 设置滚动条的轨道滑块的背景颜色和边框圆角 */
::-webkit-scrollbar-thumb {
    /*滑动的背景颜色*/
    background-color: var(--scrollbar-thumb-color);
    /*滑块的圆角边框*/
    border-radius: var(--scrollbar-thumb-border-radius);
}

/* 设置滚动条的轨道滑块，鼠标悬浮之后的背景颜色 */
::-webkit-scrollbar-thumb:hover {
    /*鼠标悬浮之后，滑动的背景颜色*/
    background-color: var(--scrollbar-thumb-hover-color);
}

/* 适配 Firefox 浏览器 */
@-moz-document url-prefix() {
    /* 可以设置为thin、auto或none等，这里设置为较窄的滚动条 */
    scrollbar-width: thin;
    /* 滑块轨道的颜色 */
    scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);
}